@color006db2: #006db2;
@color1c91dd: #1c91dd;
@media (max-width: 576px) {
  html {
    font-size: 10px;
  }
}
@media (min-width: 576px) {
  html {
    font-size: 12px;
  }
}
@media (min-width: 768px) {
  html {
    font-size: 14px;
  }
}
@media (min-width: 992px) {
  html {
    font-size: 16px;
  }
}
.color1c91dd {
  color: @color1c91dd;
}
.bg006db2{
  background: @color006db2;
}
.bg1c91dd{
  background: @color1c91dd;
}
.cursorPointer {
  cursor: pointer;
}
header {
  .navbar-toggler-icon {
    background-image: url(../img/navigatebtn.png);
  }
  #search {
    width: 1.8rem;
  }
  .active {
    background: @color1c91dd;
    color: #fff !important;
  }
  #line,
  #line2 {
    width: 0.05rem;
  }
  #searchInput {
    input {
      flex: 1;
      border: @color1c91dd 0.15rem solid;
      border-top-left-radius: 0.2rem;
      border-bottom-left-radius: 0.2rem;
      &::placeholder {
        color: #aaa;
        padding-left: 0.5rem;
      }
    }
    div {
      width: 2.4rem;
      height: 2.4rem;
      background: @color1c91dd url(../img/search2.png) center center no-repeat;
      background-size: 1.2rem;
    }
  }
  border-bottom: 0.125rem solid @color1c91dd;
}
.line3 {
  height: 0.1rem;
}
#ergonomics{
  #introduction{
    background: rgba(20, 20, 20, 0.8);
    transform: translate(-400px);
  }
  #hov{
    &:hover{
      #introduction{
        transition: 1s;
        transform: translate(0);
      }
    }
  }
}
#contact{
  .w3{
    width: 3rem;
  }
  #map{
    height: 50vh;
  }
}
footer{
  z-index: 11;
}
